{extend name="public/base" /} {block name="title"} Profile {/block} {block name="content"}

<div class="page">
    <div class="page__hd profile">
        <img src="{$member_info.picture}" alt="">
        <p>You have $<span class="amount">{$member_info.amount}<span></p>
    </div>
    <div class="page__bd">
        <div class="weui-btn-area">
            <a href="javascript:;" class="weui-btn weui-btn_plain-primary recharge">recharge</a>
            <a href="javascript:;" class="weui-btn weui-btn_plain-primary withdraw">withdraw</a>
        </div>
    </div>
</div>

<div id="paypal" class="weui-popup__container popup-bottom">
    <div class="weui-popup__overlay"></div>
    <div class="weui-popup__modal">
        <div id="paypal-button"></div>
    </div>
</div>

{/block} {block name="script"}
<!-- Load the required components. -->
<script src="https://js.braintreegateway.com/web/3.16.0/js/client.min.js"></script>
<script src="https://js.braintreegateway.com/web/3.16.0/js/paypal-checkout.min.js"></script>

<!-- Use the components. We'll see usage instructions next. -->
<script src="https://www.paypalobjects.com/api/checkout.js" data-version-4></script>
<script>
    $(function () {
        $('.recharge').on('click', function () {
            $.prompt({
                title: 'recharge',
                text: 'Please input recharge amount',
                input: '0',
                empty: false, // 是否允许为空
                onOK: function (input) {
                    //点击确认
                    payButton(input)
                    $("#paypal").popup();
                },
                onCancel: function () {
                    //点击取消
                }
            });
        })
    })
</script>
<script>
    // Create a client.
    function payButton(amount) {
        $('#paypal-button').html('');
        braintree.client.create({
            authorization: "{$clientToken}"
        }, function (clientErr, clientInstance) {

            // Stop if there was a problem creating the client.
            // This could happen if there is a network error or if the authorization
            // is invalid.
            if (clientErr) {
                console.error('Error creating client:', clientErr);
                return;
            }

            // Create a PayPal Checkout component.
            braintree.paypalCheckout.create({
                client: clientInstance
            }, function (paypalCheckoutErr, paypalCheckoutInstance) {

                // Stop if there was a problem creating PayPal Checkout.
                // This could happen if there was a network error or if it's incorrectly
                // configured.
                if (paypalCheckoutErr) {
                    console.error('Error creating PayPal Checkout:', paypalCheckoutErr);
                    return;
                }

                // Set up PayPal with the checkout.js library
                paypal.Button.render({
                    env: 'production', // or 'sandbox'

                    payment: function () {
                        return paypalCheckoutInstance.createPayment({
                            flow: 'checkout', // Required
                            amount: amount, // Required
                            currency: 'USD', // Required
                            locale: 'en_US',
                            enableShippingAddress: true,
                            shippingAddressEditable: false,
                            shippingAddressOverride: {
                                recipientName: 'Scruff McGruff',
                                line1: '1234 Main St.',
                                line2: 'Unit 1',
                                city: 'Chicago',
                                countryCode: 'US',
                                postalCode: '60652',
                                state: 'IL',
                                phone: '123.456.7890'
                            }
                        });
                    },

                    onAuthorize: function (data, actions) {
                        return paypalCheckoutInstance.tokenizePayment(data)
                            .then(function (payload) {
                                $.ajax({
                                    url: 'http://hk.net18.top/joybet/index/notify',
                                    type: 'post',
                                    data: {
                                        nonce: payload.nonce,
                                        amount: amount,
                                        uid: {$uid}
                                    },
                                    success: function (res) {
                                        if(res.err){
                                            $.alert(res.msg, 'hint');
                                        }else{
                                            $('.amount').text(res.data);
                                            $.alert(res.msg, 'hint');
                                        }
                                    }
                                })
                                // Submit `payload.nonce` to your server
                            });
                    },

                    onCancel: function (data) {
                        console.log('checkout.js payment cancelled', JSON.stringify(data, 0,
                            2));
                    },

                    onError: function (err) {
                        console.error('checkout.js error', err);
                    }
                }, '#paypal-button').then(function () {
                    // alert('准备就绪')
                    // The PayPal button will be rendered in an html element with the id
                    // `paypal-button`. This function will be called when the PayPal button
                    // is set up and ready to be used.
                });

            });

        });
    }
</script>

{/block}